import {Fragment,useEffect,useState} from 'react'
import * as api from '@/api/goods'
import { Button, Image, message, Form } from 'antd'
import TableCom from '@/components/table'
const ShopList = ()=>{
    let [tableData,setTableData] = useState<any>()
    useEffect(()=>{
        api.getGoods()
        .then(res=>{
            console.log(res.data.data);
            res.data.data.forEach((item:any) => {
                item.key=Math.random()
            });
            setTableData(res.data.data)
        })
    },[])
    let [columns, setcolumns] = useState<Array<Object>>([
        {
            title: '产品图片',
            dataIndex: 'imageUrl',
            key: 'imageUrl',
            render: (text: any) => <Image src={text} width={40} />
        },
        {
            title: 'vip3充值',
            dataIndex: 'productName',
            key: 'productName',
        },
        {
            title: '产品介绍',
            dataIndex: 'description',
            key: 'description',
        },
        {
            title: '库存',
            dataIndex: 'inventory',
            key: 'inventory',
        },
        {
            title: '价格',
            dataIndex: 'price',
            key: 'price',
        },
        {
            title: '操作',
            render: (text: any) => (
                <div>
                    <Button >删除</Button>
                    <Button >修改</Button>
                    <Button >查看</Button>
                </div>
            )
        }
    ])
    let handleShow = ()=>{

    }
    return (
        <Fragment>
            <h1>产品列表</h1>
            <button onClick={handleShow}>点击添加</button>

            
            <TableCom columns={columns} tableData={tableData}></TableCom>
        </Fragment>
    )
}

export default ShopList